<template>
	<swiper class="swiper" circular :autoplay="autoplay" :interval="interval" :duration="duration">
		<swiper-item v-for="item in list" :key="item.id" @click="show(item)">
			<image :src="item.img" class="img"></image>
		</swiper-item>
	</swiper>
</template>

<script>
		export  default {
			props:["autoplay","interval","duration","list"],
			methods:{
				show(info){
					this.$emit('show',info);
				}
			}
		}
</script>

<style>
	
	.swiper {
		height: 400rpx;
	}
	
	.swiper-item {
		display: block;
		height: 400rpx;
		line-height: 400rpx;
		text-align: center;
	}
	
	.swiper-list {
		margin-top: 40rpx;
		margin-bottom: 0;
	}
	
	.img {
		width: 100%;
		height: 100%;
	}
</style>